<template>
    <div class="monthly">
        <div class="title">
            <el-radio-group v-model="select" size="small">
                <el-radio-button label="1">本月</el-radio-button>
                <el-radio-button label="2">上月</el-radio-button>
            </el-radio-group>
            <span>&nbsp;</span>
            <el-tag type="info">月报表</el-tag>
        </div>
        <div class="list">
            <el-table
                class="tables"
                border
                size="mini"
                :header-cell-style="{background:'#ccc'}"
                :data="list"
                stripe
                style="width: 100%"
                show-summary
            >
                <el-table-column prop="day" label="日期" min-width="60"></el-table-column>
                <el-table-column prop="quantity" label="笔数" min-width="40"></el-table-column>
                <el-table-column prop="totalBets" label="总投" min-width="50"></el-table-column>
                <el-table-column prop="profit" label="盈亏" min-width="40"></el-table-column>
            </el-table>
        </div>
        <el-pagination
            :current-page.sync="curpages"
            :pager-count="5"
            @current-change="fy"
            size="mini"
            :page-size="10"
            background
            layout="prev, pager, next"
            :total="total"
        ></el-pagination>
    </div>
</template>

<script>
import moment from "moment";
import { mapState } from "Vuex";
export default {
    name: "monthly",
    data() {
        return {
            select: 1,
            list: [],
            // -------------------
            pages: 1,
            total: 10,
            curpages: 1
        };
    },
    computed: {
        ...mapState(["saveType", "modules"])
    },
    created() {
        this.getList();
    },
    watch: {
        saveType() {
            this.getList();
        },
        select() {
            this.getList();
        }
    },
    methods: {
        
        getList() {
            var params = {
                module: this.saveType,
                month: this.select
            };
            this.$api.post(this.$url.report4Month, params, res => {
                console.log(res.data);
                if (res.data.code == 200) {
                    this.list = res.data.data;
                }
            });
        },
        fy() {}
    }
};
</script>

<style lang="less" scoped>
.monthly {
    padding: 0 5px;
    box-sizing: border-box;
    .title {
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
}
</style>
